<template>
    <div class="norm-form">
        <el-form ref="FormRef" :model="state.form" :rules="rules" label-width="auto" status-icon>
            <el-form-item label="报表" prop="tableId">
                <el-select v-model="state.form.tableId" placeholder="请选择报表" filterable>
                    <el-option :label="item.name" :value="item.id" v-for="item in state.tables" :key="item.id" />
                </el-select>
            </el-form-item>
            <el-form-item label="采集对象" prop="collectObj">
                <el-select v-model="state.form.collectObj" placeholder="请选择采集对象">
                    <el-option :label="item.des" :value="item.code" v-for="item in state.categorys" :key="item.code" />
                </el-select>
            </el-form-item>
            <el-form-item label="批次号" prop="batchNumber">
                <el-input v-model="state.form.batchNumber" style="flex-grow:1" placeholder="请输入批次号">
                </el-input>
            </el-form-item>
            <el-form-item style="margin-top:40px">
                <el-button type="primary" @click="submit()">
                    保存
                </el-button>
                <el-button @click="cancel">取消</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>
<script setup>
import { reactive, ref, onMounted } from 'vue'
import { ElNotification } from 'element-plus'
import { enums } from '@/api/common/common'
import { add } from '@/api/enact/task'
import { conditionList } from '@/api/enact/table'
import { useRouter } from 'vue-router'
import { dayjs } from 'element-plus'


const router = useRouter()
const FormRef = ref(undefined)

const state = reactive({
    tables: [],
    categorys: [],
    form: {
        tableId: undefined,
        collectObj: undefined,
        batchNumber: dayjs(new Date()).format("YYYYMMDD")+"-临时",
    },
})



const rules = reactive({
    tableId: [
        { required: true, message: '报表必选', trigger: 'change' },
    ],
    collectObj: [
        { required: true, message: '采集对象必选', trigger: 'change' },
    ],
    batchNumber: [
        { required: true, message: '批次号必填', trigger: 'blur' },
    ],
})







const submit = async () => {
    await FormRef.value.validate((valid, fields) => {
        if (valid) {
            add(state.form).then(data => {
                ElNotification({
                    title: '操作成功',
                    message: '计划新增成功',
                    type: 'success',
                })
                router.push('/task-list')
            })
        }
    })
}



const cancel = () => {
    router.push('/task-list')
}

const getTableList = () => {
    conditionList({}).then(data => {
        state.tables = data
    })
}
const getCategoryList = () => {
    enums('CollectObjCategory').then(data => {
        state.categorys = data
    })
}

onMounted(() => {
    getCategoryList()
    getTableList()
})

</script>
<style scoped lang="scss"></style>
